<template>
  <div class="login">
    <div class="login1">
      <div class="login2">
        <img src="../../assets/image/logo.png">
        <div class="login8">欢迎登录美食校园美食分享平台</div>
      </div>
      <div class="login3">
        <div class="login4">
          <el-input style="margin-top:30px" prefix-icon="el-icon-user-solid" v-model="loginAccount" placeholder="请输入用户账号"></el-input>
          <el-input style="margin-top:30px" prefix-icon="el-icon-arrow-right" type="password" v-model="password" placeholder="请输入用户密码"></el-input>
          <div class="login5">
            <div @click="toRegister">注册？</div>
            <div @click="toForget">忘记密码？</div>
          </div>
          <div class="login6">
            <div class="login7" @click="login">
              登 录
            </div>
          </div>
        </div>
      </div>
    </div>
  </div>
</template>

<script>
  import {login,getUser} from '../../api/api' 
  export default {
    data() {
      return{
        loginAccount: "",
        password: "",
      }
    },
    methods: {
      toRegister() {
        this.$router.push("/register")
      },
      toForget() {
        this.$router.push("/forget")
      },
      login() {
        if(!this.loginAccount) {
            this.$message({
                message: '请输入用户账号',
                type: 'warning'
            });
            return;
        }
        if(!this.password) {
            this.$message({
                message: '请输入密码',
                type: 'warning'
            });
            return;
        }
        var params = {
            loginAccount: this.loginAccount,
            password: this.password,
            type: 0
        }
        login(params).then(res => {
            if(res.code == 1000) {
                this.$message({
                    message: '登陆成功',
                    type: 'success'
                });
                var that = this
                var token = res.data.token
                window.localStorage.setItem("user_token",token)
                this.getUserInfo()
                setTimeout(function() {
                    that.$router.push("/")
                },500)
            } else {
                this.$message.error(res.message);
            }
        })
      },
      getUserInfo() {
          getUser().then(res => {
              if(res.code == 1000) {
                  window.localStorage.setItem("user_info",JSON.stringify(res.data))
              }
          })
      },
    },
    created() {
     
    },
    mounted() {
      
    }
 }
</script>

<style scoped>
@import url('../../assets/css/login.css');
.login4>>>.el-input__inner {
  -webkit-appearance: none;
  background-color: #EEF0F3;
  background-image: none;
  border-radius: 4px;
  border: 0;
  width: 100%;
  font-family: '黑体';
}
</style>